<template>
<!--pages/integralorderlist/integralorderlist.wxml-->
<view class="content">
	<view class="myOrder">
		<view :class="'orderItem ' + (1==navIOndex?'on':'')" @tap="orderItem" data-myindex="1">所有</view>
		<view :class="'orderItem ' + (2==navIOndex?'on':'')" @tap="orderItem" data-myindex="2">充值</view>
		<view :class="'orderItem ' + (3==navIOndex?'on':'')" @tap="orderItem" data-myindex="3">消费</view>
		<view :class="'orderItem ' + (4==navIOndex?'on':'')" @tap="orderItem" data-myindex="4">赠送</view>

	</view>
	<scroll-view v-if="orderList[navIOndex-1].length" scroll-y class="shongscontent" @scrolltoupper="getNew" @scrolltolower="getMore" upper-threshold="1" lower-threshold="30">
		<block v-for="(item, index) in orderList[navIOndex-1]" :key="index" >
			<view class="songs_item" @tap="toRechargeDetail" :data-type="item.type" :data-detail_id="item.id" :data-vid="item.vid" >
				<view class="left">
					<image src="https://safood-1317438654.cos.ap-guangzhou.myqcloud.com/tempImage/1729070799670f86cf7fab5.png"></image>
					<text class="storetitle">{{item.store_name?item.store_name:'在线充值'}}</text>
				</view>
				<view class="msg">
					<text class="span">{{item.type_name}} {{item.all_money}}</text>
					<view class="span span3">{{item.add_time}}</view>
				</view>
			</view>
		</block>
		<view class="loading">
			<block v-if="isLoading">
				<image src="https://mall.xzthealth.com/loading2.gif"></image>    
				<text>加载中</text>
			</block>
			<block @tap="getMore" v-else-if="canLoad[navIOndex-1]">
				<text>下拉加载更多</text>
			</block>
		</view>
		<view class="kong" v-if="empty[navIOndex-1]==1">暂无记录</view>
		<view class="kong" v-else-if="!isLoading&&!canLoad[navIOndex-1]&&orderList[navIOndex-1].length">已经到底了</view>
	</scroll-view>
</view>
</template>

<script>
// pages/integralorderlist/integralorderlist.js
var App = getApp().globalData;

export default {
  data() {
    return {
      orderList: [[], [], [], []],
      navIOndex: 1,
      page: [0, 0, 0, 0],
      canLoad: [true, true, true, true],
      empty: [0, 0, 0, 0],
      isLoading: false,
    };
  },

  components: {},
  props: {},
  async onLoad() {
  	await this.$onLaunched;
    this.loadintegral(1);
	
  },

  /**
   * 生命周期函数--监听页面初次渲染完成
   */
  onReady: function () {},

  /**
   * 生命周期函数--监听页面显示
   */
  onShow: function () {},
  methods: {
    orderItem: function (e) {
      // console.log(e);
      var oldindex = this.navIOndex;
      var index = e.currentTarget.dataset.myindex;
      var empty = this.empty;

      if (oldindex == index) {
        return;
      }

      this.setData({
        navIOndex: index,
        empty: empty
      });

      if (!this.orderList[index - 1].length) {
        this.loadintegral(index);
      }
    },
	toRechargeDetail(e){
		let type = Number(e.currentTarget.dataset.type);
		let detail_id = e.currentTarget.dataset.detail_id
		let vid = e.currentTarget.dataset.vid
		switch(type){
			case 1:
			case 3:
			case 5:
			case 6:
			case 7:
			case 8:
				uni.navigateTo({
					url: '../recharge_details/recharge_details?id=' + detail_id + '&vid=' + vid
				})
				break;
		}
	},

    /**
     * 生命周期函数--监听页面加载
     */
    getMore: function () {
      this.loadintegral(this.navIOndex);
    },
    getNew: function () {
      var page = this.page;
      page[this.navIOndex] = 0;
      this.loadintegral(this.navIOndex);
    },
    loadintegral: function (index) {
      var canLoad = this.canLoad;

      if (canLoad[index - 1] == false) {
        return;
      }

      canLoad[index - 1] = false;
      this.setData({
        isLoading: true,
        canLoad: canLoad
      });
      var that = this;
      var page = this.page;
      var p = page[index - 1] + 1;
      var orderList = that.orderList;
      var empty = this.empty;
      getApp().globalData.sendRequest({
        url: '/Vip/BalanceRecord',
        data: {
          type: index,
          page: p
        },
        showLoading: false,
        success: function (res) {
          if (res.status == 1) {
            page[index - 1] = p;

            if (res.count > res.data.length) {
              canLoad[index - 1] = false;
            } else {
              canLoad[index - 1] = true;
            }

            if (p == 1) {
              orderList[index - 1] = res.data;
            } else {
              var arr = res.data;
              var arr1 = orderList[index - 1];
              arr1.push.apply(arr1, arr);
              orderList[index - 1] = arr1;
            }

            that.setData({
              orderList: orderList,
              canLoad: canLoad,
              page: page,
              isLoading: false
            });
          } else {
            canLoad[index - 1] = false;

            if (p == 1) {
              empty[index - 1] = 1;
              that.setData({
                canLoad: canLoad,
                empty: empty
              });
            } else {
              that.setData({
                canLoad: canLoad
              });
            }
          }
        }
      });
    }
  }
};
</script>
<style>
@import "./balanceOrder.css";
</style>